<template>
	<div class="audio">
		<slot :value="data" :status="status"></slot>
		<audio :src="data.file_path" type="audio/mp3" ref="audio"></audio>
	</div>
</template>

<script>
	export default {
		name: 'wt-audio',
		props: {
			value:{
				type:Object
			},
			//0已就绪但未播放，1播放中，2已播放，-1播放失败
			status:{
				type:Number,
				default:0
			}
		},
		data() {
			return {
				data:this.value,
			}
		},
		computed:{
			audio(){
				return this.$refs.audio
			}
		},
		mounted(){
			this.audio.onended = () => {
				this.status = 2
				this.$emit("input",{status:2,message:'播放完毕'})
			}
			this.audio.onerror = () => {
				alert("error")
				this.status = -1
				this.$emit("input",{status:-1,message:'播放失败'})
			}
		},
		methods: {
			play(){
				this.audio.play()
				this.status = 1
				this.$emit("input",{status:1,message:'正在播放'})
			},
			stop(){
				this.audio.pause();
				this.audio.currentTime = 0.0;
				if(this.status == 1){
					this.status = 2
				}
				
			}
		},
		created() {
			
		}
	}
</script>

<!--<style lang="less">
	.audio{
		width:100%:
		height:100px;
	}
</style>-->